<!--
 * @Autor: Ruohong Yu
 * @Date: 2022-09-13 22:43:16
 * @Description: file content
 * @FilePath: \ebook\src\components\home\Title.vue
-->
<template>
  <div class="home-title-wrapper">
    <div class="label">{{label}}</div>
    <div class="btn" @click="click">{{btn}}</div>
  </div>
</template>

<script type="text/ecmascript-6">
export default {
  props: {
    label: String,
    btn: String
  },
  methods: {
    click () {
      this.$emit('onClick')
    }
  }
}
</script>

<style lang="scss" rel="stylesheet/scss" scoped>
  @import "../../assets/styles/global";
  .home-title-wrapper {
    width: 100%;
    padding: px2rem(15) px2rem(10);
    box-sizing: border-box;
    @include top;
    .label {
      flex: 1;
      font-size: px2rem(18);
      color: #333;
      font-weight: bold;
    }
    .btn {
      cursor: pointer;
      font-size: px2rem(14);
      color: rgba(64, 158, 255, 1);
      &:active {
        color: rgba(64, 158, 255, .5);
      }
    }
  }
</style>
